<template>
	<view class="">
		<view class="is-add is-center has-mgb-10" @tap="addcode">
			<image src="../../static/img/common/plus_ico.png" mode="" class="plus-ico"></image>
			<text>添加</text>
		</view>
		<view class="is-bank has-pd-20 has-mgb-2 bg-f" v-for="(item,index) in list" :key="index">
			<view class="has-pdb-10">
				昵称：<text>{{item.ma_name}}</text>
			</view>
			<view class="has-pdb-10">
				账号：<text>{{item.ma_userno}}</text>
			</view>
			<view class="is-relative">
				<view class="is-absolute inboxrt">
					<button @click="uploadClick(item.id)" type="warn" size="mini" class="has-floatr">重新上传</button>
				</view>
				<view v-show="item.ma_moren == 0" class="is-absolute morenbox">
					<button @click="getBannerDetail(item.id,item.ma_type)" type="" size="mini" class="has-floatr">设为默认</button>
				</view>
				<view v-show="item.ma_moren == 1" class="is-absolute morenbox">
					<button type="primary" size="mini" class="has-floatr">默认码</button>
				</view>
				<image :src="item.ma_url" mode=""></image>
			</view>
<!-- 			<view class="">
				备注：<text>-</text>
				<button type="warn" size="mini" class="has-floatr">删除</button>
			</view> -->
		</view>
		<view class="">
			<image-cropper :src="tempFilePath" @confirm="confirm" @cancel="cancel" ></image-cropper>
			<!--  #ifdef MP-ALIPAY -->
			 <canvas id="myCanvas" canvas-id="myCanvas" class="meslist_canvas" crop-width="200" crop-height="200"></canvas>
			 <!--  #endif--> 
		</view>
		<view style="flex: 1;">
			<uni-err-box  :errType="errType" :errText="errText" ></uni-err-box>
		</view>
		<view style="flex: 1;">
			<uni-load-more  :loadingType="loadingType" :contentText="contentText" ></uni-load-more>
		</view>
		
	</view>
</template>

<script>
	import uniLoadMore from '@/components/load-more.vue';
	import uniErrBox from '@/components/err-box.vue';
	import ImageCropper from "@/components/ling-imgcropper/ling-imgcropper.vue";
	var _self,
		page = 1,
		timer = null;
	export default {
		components: {
			uniLoadMore,
			uniErrBox,
			ImageCropper
		},
		data() {
			return {
				tempFilePath: '',
				cropFilePath: '',
				upid:0,
				foxtoken:'',
				userinfo:[],
				fox_money_can:0,
				fox_user_jihuo:0,
				ma_lock:0,
				ma_wx:0,
				ma_alipay:0,
				errType: 0,
				errText: '',
				list:[],
				ma_type:0,
				loadingText: '加载中...',
				loadingType: 0,//定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
				contentText: {
					contentdown:'上拉显示更多',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多了'
				}
			}
		},
		onShow:function(e){
			let pages = getCurrentPages();
			let currPage = pages[pages.length-1];
			if (currPage.data.isDoRefresh == true){
				currPage.data.isDoRefresh = false;
				this.getList();
			}
		},
		onLoad() {	
			_self = this;
			this.ma_type = 0;
			this.getList();
		},
		//下拉刷新
		onPullDownRefresh: function() {
			this.getList();
		},
		// 加载更多
		onReachBottom : function(){
			if (timer != null) {
				clearTimeout(timer);
			}
			timer = setTimeout(function() {
				_self.getmore();
			}, 1000);
		},
		methods:{
			// 数据和分页是模拟的实际也是这样写
			getmore: function(){
				let info = this.service.getfox();
				let user_token = info[0]['foxtoken'];
				this.foxtoken = user_token;
				if (_self.loadingType !== 0) {//loadingType!=0;直接返回
					return false;
				}
				_self.loadingType = 1;
				uni.showNavigationBarLoading();//显示加载动画
				uni.request({
					url: this.service.FOX_URL + 'diamond/ma_list',
					method:'POST',
					data: {
						page:page,
						limit:10,
						ma_type:this.ma_type,
						user_key:user_token
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					success: res => {
						var foxmsg = res.data;
						// console.log(foxmsg)
						if (foxmsg.data.list == null  || foxmsg.data.list.length==0) {//没有数据
							_self.loadingType = 2;
							uni.hideNavigationBarLoading();//关闭加载动画
							return;
						}
						page++;//每触底一次 page +1
						_self.list = _self.list.concat(foxmsg.data.list);//将数据拼接在一起
						_self.loadingType = 0;//将loadingType归0重置
						uni.hideNavigationBarLoading();//关闭加载动画
					},
					complete: res => {
						uni.hideLoading();
						uni.stopPullDownRefresh();
					}
				});
			},
			getList: function() {//第一次回去数据
				page = 1;
				this.loadingType = 0;
				uni.showNavigationBarLoading();
				let info = this.service.getfox();
				let user_token = info[0]['foxtoken'];
				this.foxtoken = user_token;
				uni.request({
					url: this.service.FOX_URL + 'diamond/ma_list',
					method:'POST',
					data:{
						page:page,
						limit:10,
						ma_type:this.ma_type,
						user_key:user_token
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					success: res => {
						page++;//得到数据之后page+1
						var foxmsg = res.data;
						// console.log(foxmsg)
						if (foxmsg.code == 200) {                    
							_self.list = foxmsg.data.list;
							if (foxmsg.data.list.length > 0 && foxmsg.data.list.length < 10) {//没有数据
								_self.loadingType = 5;
								uni.hideNavigationBarLoading();//关闭加载动画
								return;
							}
							if (foxmsg.data.list.length == 0) {
								_self.errType = 1;
								_self.loadingType = 4;
								uni.hideNavigationBarLoading();//关闭加载动画
								return;
							}
							uni.hideNavigationBarLoading();
							uni.stopPullDownRefresh();//得到数据后停止下拉刷新
						}else{
							_self.errType = 1;
							_self.loadingType = 4;
							uni.hideNavigationBarLoading();//关闭加载动画
							return;
						}                         
					}
				});
			},
			addcode(){
				uni.navigateTo({
					url: '/pages/allcode/addcode?type=0'
				})
			},
			getBannerDetail (index,type) {
				let info = this.service.getfox();
				let user_token = info[0]['foxtoken'];
				// console.log(user_tel)
				uni.request({
					url: this.service.FOX_URL + 'diamond/set_code_moren',
					method:'POST',
					data: {
						user_key: user_token,
						id:index
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded',
					},
					success: res => {
						var rest = res.data;
						// console.log(rest)
						if(rest.status == 'success'){
							this.getList();
							uni.showToast({
								title:'设为默认成功',
								icon:'none',
							})
							uni.setStorageSync('matype', type);
							setTimeout(function() {
							    uni.navigateTo({
							    	url:'/pages/index/orderline'
							    })
							}, 1500)
						}else{
							uni.showToast({
								title:'设置失败',
								icon:'none',
							})
						}
					}
				})
			},
			uploadClick: function(id) {
				let that = this;
				this.upid = id;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {
						this.tempFilePath = res.tempFilePaths.shift()
					}
				});
			},
			confirm(e) {
				this.tempFilePath = '';
				this.cropFilePath = e.detail.tempFilePath;
				let id = this.upid;
				let u =this.foxtoken;
				uni.uploadFile({
					url: _self.service.FOX_URL+'diamond/upload_picgo',
					filePath: _self.cropFilePath,
					fileType: 'image',
					name: 'file',
					formData: {
						'id':id,
						'user_key':u,
						'path' : 'ma',
						'type' : 'mawx.ma'
					},
					success: (uploadFileRes) => {
						_self.getList();
					}
				});
			},
			cancel() {
				console.log('canceled')
			}
		}
	}
</script>

<style>
	.is-add{
		background: #FFFFFF;
		height: 120rpx;
		line-height: 120rpx;
	}
	.plus-ico{
		width:40rpx;
		height: 40rpx;
		vertical-align: middle;
		margin-right: 20rpx;
	}
</style>
